<template>
	<view class="bg_size">
		<view class="logo_top">
			<image class="logo_size" src="@/static/bg.png"></image>
			<view class="title_size">金维订奶商家后台</view>
		</view>
		<view class="login_num">
			<view class="Account">账号</view>
			<u-input v-model="acc" type="text" placeholder="请输入账号" :clearable="false" />
			<view class="xian"></view>
		</view>
		<view class="login_num">
			<view class="Account" style="margin-top: 50rpx;">密码</view>
			<u-input v-model="pass" type="password" :border="false" password-icon="true" :clearable="false"
				placeholder="请输入密码" />
			<view class="xian"></view>
		</view>
		<view class="Forgot">
			<image class="Forgot_img" src="@/static/wangji.png"></image>
			<view class="Forgot_size">忘记密码？</view>
		</view>
		<view class="login_bot">
			<view class="login" @click="login">登录</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				acc:'',
				pass:''
			}
		},
		methods: {
			login() {
	/* 			this.$api.request({
					url: 'auth/login',
					method: 'post',
					data: {
						phone: this.acc,
						password: this.pass
					}
				}).then(res => {
					console.log('res', res);
					if (res.code == 200) {
						console.log(res.data);
						uni.setStorageSync('USER_INFO', res.data.token);
						uni.setStorageSync('USER_DATA', res.data);
						uni.showToast({
							title: res.msg,
							icon: ''
						})
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/index/index'
							})
						}, 1000)
				
					}else{
						uni.showToast({
							title: res.msg,
							icon: ''
						})
					}
				}).catch(err => {
					console.error(error);
				}); */
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.bg_size {
		padding: 0 60rpx;

		.logo_top {
			text-align: center;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			margin: 46rpx 0rpx 100rpx 0rpx;

			.logo_size {
				width: 150rpx;
				height: 140rpx;
				// margin-bottom: 20rpx;
			}

			.title_size {
				font-size: 50rpx;
				font-weight: 500;
				line-height: 120rpx;
				color: rgba(31, 35, 41, 1);
			}
		}

		.login_num {
			margin-bottom: 60rpx;
			height: 140rpx;

			.Account {
				font-size: 30rpx;
				font-weight: 500;
				line-height: 43rpx;
				color: #17271B;
				margin-bottom: 30rpx;
			}

			.input_acc {
				border-bottom: 1rpx solid red;
			}

			.xian {
				width: 100%;
				height: 2rpx;
				background-color: rgba(208, 211, 213, 1);
				margin-top: 30rpx;
			}
		}

		.Forgot {
			display: flex;
			align-items: center;
			justify-content: flex-end;

			.Forgot_img {
				width: 32rpx;
				height: 32rpx;
				margin-right: 10rpx;
			}

			.Forgot_size {
				font-size: 28rpx;
				font-weight: 400;
				line-height: 40rpx;
				color: #187CE7;
			}
		}

		.login_bot {
			position: fixed;
			bottom: 67rpx;
			width: 100%;
			left: 0;
			padding: 0rpx 60rpx;
			.login {
				height: 100rpx;
				background: linear-gradient(90deg, rgba(41, 166, 241, 1) 0%, rgba(21, 116, 229, 1) 100%), linear-gradient(90deg, rgba(38, 177, 161, 1) 0%, rgba(111, 208, 179, 1) 100%);
				background-blend-mode: normalnormal;
				border-radius: 50rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 30rpx;
				font-weight: 400;
				line-height: 43rpx;
				color: #FFF;
				margin-bottom: 50rpx;
			}
		}
	}
</style>